<template>
  <div>
    <div>
      <!-- 页头 -->
      <div class="back">
        <i class="el-icon-back" @click="$router.go(-1)"></i>
        <span style="padding: 10px; color: rgba(0, 0, 0, 0.15)">|</span>
        <span style="font-size: 20px; font-weight: 500; color: #2f343e"
          >新增监管业务知识</span
        >
      </div>
      <!-- 主题 -->
      <div class="box-top">
        <div
          style="
            font-size: 16px;
            color: rgba(0, 0, 0, 0.85);
            font-weight: 550;
            margin-bottom: 20px;
          "
        >
          基本信息
        </div>
        <el-form
          ref="form"
          :model="formData"
          :rules="rules"
          label-width="120px"
          label-position="left"
        >
           <el-form-item label="名称:" style="margin-left: 92px">
                <el-input
                  v-model="formData.name"
                  placeholder="请输入"
                  style="width: 1020px; margin-left: 0px"
                />
              </el-form-item>
          <div style="display: flex">
            <div class="content-box-left">
              <el-form-item label="级别：">
                <el-select
                  v-model="formData.type"
                  placeholder="请选择级别"
                  style="width: 370px; margin-left: 0px"
                >
                  <el-option label="区域一" value="shanghai"></el-option>
                  <el-option label="区域二" value="beijing"></el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="处置状态：">
                <el-select
                  v-model="formData.type"
                  placeholder="请选择处置状态"
                  style="width: 370px; margin-left: 0px"
                >
                  <el-option label="区域一" value="shanghai"></el-option>
                  <el-option label="区域二" value="beijing"></el-option>
                </el-select>
              </el-form-item>
            </div>
            <div class="content-box-right">
              <el-form-item label="类别:">
                <el-select
                  v-model="formData.type"
                  placeholder="请选择类别"
                  style="width: 370px; margin-left: 0px"
                >
                  <el-option label="区域一" value="shanghai"></el-option>
                  <el-option label="区域二" value="beijing"></el-option>
                </el-select>
              </el-form-item>
                <el-form-item label="来源:">
                <el-select
                  v-model="formData.type"
                  placeholder="请选择来源"
                  style="width: 370px; margin-left: 0px"
                >
                  <el-option label="区域一" value="shanghai"></el-option>
                  <el-option label="区域二" value="beijing"></el-option>
                </el-select>
              </el-form-item>
           
            </div>
          </div>
            <el-form-item label="发起事由:" style="margin-left: 92px;width: 1140px;" >
        <el-input type="textarea" :rows="10" :cols="10"></el-input>
      </el-form-item>
        </el-form>
      </div>
      <!-- 中间盒子 -->
      <div class="box-content">
        <div
          style="
            font-size: 16px;
            color: rgba(0, 0, 0, 0.85);
            font-weight: 550;
            margin-bottom: 20px;
          "
        >
          处置信息
        </div>
        <el-form
          ref="form"
          :model="formData"
          :rules="rules"
          label-width="120px"
          label-position="left"
        >
            <el-form-item label="危害程度评估:" style="margin-left: 92px;width: 1140px;" >
        <el-input type="textarea" :rows="10" :cols="10"></el-input>
      </el-form-item>
           <el-form-item label="事件成因:" style="margin-left: 92px;width: 1140px;" >
        <el-input type="textarea" :rows="10" :cols="10"></el-input>
      </el-form-item>
           <el-form-item label="事件过程:" style="margin-left: 92px;width: 1140px;" >
        <el-input type="textarea" :rows="10" :cols="10"></el-input>
      </el-form-item>
            <el-form-item label="处置措施:" style="margin-left: 92px;width: 1140px;" >
        <el-input type="textarea" :rows="10" :cols="10"></el-input>
      </el-form-item>
        </el-form>
      </div>
    </div>
    <div slot="footer" class="dialog-footer">
      <el-button @click="$router.go(-1)">取 消</el-button>
      <el-button type="primary" @click="$router.go(-1)">提 交</el-button>
    </div>
  </div>
</template>
<script>
import HkTable from "@/components/HKTable";

export default {
  components: { HkTable },
  data() {
    return {
      cycleNodeOption: [],
      formData: {
        cronType: "1",
        type: "",
        name: "",
        cycleTime: 0,
        timeNode: "",
        times: "",
        cycleNode: "",
      },
      // 表单参数
      rules: {
        name: [
          { required: true, message: "作业名称不能为空", trigger: "blur" },
        ],
        type: [{ required: true, message: "请选择作业类型", trigger: "blur" }],
        cycleTime: [{ required: true, message: "请选择", trigger: "blur" }],
        timeNode: [{ required: true, message: "请选择", trigger: "blur" }],
        day: [{ required: true, message: "请选择", trigger: "blur" }],
        times: [{ required: true, message: "请选择", trigger: "blur" }],
      },
      //   表头名称
      tableLabelList: [
        { label: "来源", param: "name", type: "slot", width: "240px" },
        {
          label: "分类",
          param: "datasourceName",
          type: "slot",
          width: "240px",
        },
        {
          label: "家族",
          param: "outputDatasourceName",
          type: "slot",
          width: "240px",
        },
        { label: "组织", param: "people", type: "slot" },
      ],
      arrList: [
        {
          name: "",
          datasourceName: "",
          outputDatasourceName: "",
          people: "",
        },
      ],
      // 域名
      tableNameList: [
        { label: "域名", param: "name", type: "slot", width: "650px" },
        { label: "发现时间", param: "people", type: "slot" },
      ],
      nameList: [
        {
          name: "",
          datasourceName: "",
          outputDatasourceName: "",
          people: "",
        },
      ],
      // URL
      tableUrlList: [
        { label: "URL", param: "name", type: "slot", width: "420px" },
        { label: "威胁等级", param: "datasourceName", type: "slot",width: "230px" },
        
        { label: "扫描时间", param: "people", type: "slot" },

      ],
      urlList: [
        {
          name: "",
          datasourceName: "",
          outputDatasourceName: "",
          people: "",
        },
      ],
      // 样本
        tableBookList: [
        { label: "HASH", param: "name", type: "slot", width: "420px" },
        { label: "威胁等级", param: "datasourceName", type: "slot",width: "230px" },
        { label: "检测时间", param: "people", type: "slot" },
      ],
      bookList: [
        {
          name: "",
          datasourceName: "",
          outputDatasourceName: "",
          people: "",
        },
      ],
    };
  },
};
</script>

<style scoped lang="scss">
.back {
  margin-bottom: 20px;
}
.box-top {
  background-color: #ffffff;
  padding: 20px;
  margin-bottom: 20px;
  .content-box-left {
    margin-left: 92px;
  }
  .content-box-right {
    margin-left: 160px;
  }
}
.box-content {
  background-color: #ffffff;
  padding: 20px;
  margin-bottom: 20px;
  // height: 220px;
}
.box-content1 {
  background-color: #ffffff;
  padding: 20px;
  // margin-bottom: 20px;
  
  height: 200px;
}
.son-panel {
  display: flex !important;
}
::v-deep  [data-v-1c51fe52] .el-textarea__inner{
    height: 120px;
}
.dialog-footer {
  margin-top: 100px;
  display: flex;
  justify-content: flex-end;
  background-color: #ffffff;
  padding: 14px 20px;
  position: fixed;
  left: 0;
  bottom: 0;
  width: 100%;
}
::v-deep {
  .el-form-item--medium .el-form-item__content {
    margin-bottom: 20px;
  }
  .box-top[data-v-1a8a03f8] {
    padding-bottom: 11px;
  }
  .el-input--medium .el-input__inner {
    height: 32px;
    line-height: 32px;
  }
  .el-form-item__content {
    line-height: 0px;
  }
  .el-pagination {
    display: NONE;
  }
  .el-form-item--medium .el-form-item__label {
    margin-top: -2px;
  }
  .el-table th.el-table__cell > .cell {
    padding-left: 37px;
  }
  .el-textarea__inner {
    resize: none;
  }
  .el-input--medium .el-input__icon {
    margin-left: 153px;
  }
}
</style>
